<!DOCTYPE html>
<html lang="zh">
<head>
	<meta charset="UTF-8">
	<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1"> 
	<meta name="viewport" content="width=device-width, initial-scale=1.0">
	<title></title>
	<link rel="stylesheet" type="text/css" href="css/normalize.css" />
	<link rel="stylesheet" type="text/css" href="css/htmleaf-demo.css">
	<style type="text/css">
		body{
		    font-size:1em;
		    color:#FFFFFF;
		    background-color:#000000;
		}
		#Ellipse{
		    position:relative;
		    visibility:visible;
		    z-index:1;
		    width:700px;
		    height:80px;
		    border:none;
		    margin-top: 250px;
		    margin-bottom: 100px;
		}
		.RotatingIcon{
		    border:none;
		    width:80px;
		}
	</style>
</head>
<body onload="InitScripts()">
	<div class="htmleaf-container">
		<div id="Ellipse">
		 <img class="RotatingIcon"  src="img/hover0.png">
		 <img class="RotatingIcon"  src="img/hover1.png">
		 <img class="RotatingIcon"  src="img/hover2.png">
		 <img class="RotatingIcon"  src="img/hover3.png">
		 <img class="RotatingIcon"  src="img/hover4.png">
		 <img class="RotatingIcon"  src="img/hover5.png">
		</div>
		<div class="related">
		    <a href="http://www.htmleaf.com/jQuery/Slideshow-Scroller/201609214022.html">
			  <img src="related/1.jpg" width="300" alt=""/>
			</a>
			<a href="http://www.htmleaf.com/jQuery/Slideshow-Scroller/201607273788.html">
			  <img src="related/2.jpg" width="300" alt=""/>
			</a>
		</div>
	</div>
	
	<script src="js/ImageRotator-min.js"></script>
	<script type="text/javascript">
	var imageRotater = null;
	function InitScripts(){
	 imageRotater = ImageRotatorJS('Ellipse','RotatingIcon',5,110,3000, 0, 90, 40, null);
	}
	</script>

</body>
</html>